// 在这里需要通过固定的语法来声明全局变量
export const state = ()=>({
    // userInfo就是我们声明的全局变量用于保存token和user
    userInfo: { 
        token: "",
        user: {}
    }
})
// vuex 有专门的方法来设置全局变量的值，
// 也就是说我们不能直接在登录页面给userInfo赋值
// 什么方法来设置userInfo的值呢？答：如下：
export const mutations = {
    // state是默认参数，指的是上面的state
    //设置全局变量userInfo的值
    setUserInfo(state, data){
        state.userInfo = data
    },
    removeUserInfo(state){
        // 退出登录
        state.userInfo = {
            token: "",
            user: {}
        }
    }
}

/**
 * 问题：当我们刷新浏览器的时候，保存到vuex中的数据会重置，但是正常的网站这些数据肯定是不能被重置的
 * 因此我们需要把这些数据缓存到浏览器中，这样刷新浏览器的时候就不会被重置了
 * 怎么缓存呢？
 * 答：可以通过vuex-persistedstate这个插件来实现
 * 
 * 插件下载命令：
 * npm install --save vuex-persistedstate --legacy-peer-deps
 * 
 * 这个插件可以自动帮我们把保存在vuex中的数据缓存到浏览器中
 * 
 * */ 
